<template>
  <div>
    <!-- <h1>{{count}}</h1> -->
     <!-- <button @click="changeCount">累加</button> -->
    <button @click="changePerson">修改person</button>
    <h1>{{person.age}}--{{person.name}}--{{person.sex}}</h1>
  </div>
</template>

<script lang="ts">
  import {defineComponent} from "vue"
  export default defineComponent({
    name:'Abort',
  })


</script>
<script setup lang="ts">
import {ref} from "vue"
// 使用ref创建对象类型响应式数据，生成的是RefImpl对象，对象中的value才是proxy对象
//在模板中可以直接使用这个对象中的属性，但在setup中需要使用.value才能操作
let person = ref({
  name:'gaogao',
  age:19,
  sex:'female'
})
 console.log(person)
 const changePerson =()=>{
    person.value.age++
 }



</script>